<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>结构性伪类选择符 E:nth-child(n)</title>
		<style>
			/*li:nth-child(7){color:#f00;}  选中指定序号(正序)*/
			/*li:nth-child(odd){color:#f00;}  选中奇odd偶even类型(正序)*/
			/*li:nth-child(2n+1){color:#f00;}  选中自定义序列类型(正序)*/
		</style>
	</head>
	<body>
		<ul>
			<li>我是爹地的第1个孩子</li>
			<li>我是爹地的第2个孩子</li>
			<li>我是爹地的第3个孩子</li>
			<li>我是爹地的第4个孩子</li>
			<li>我是爹地的第5个孩子</li>
			<li>我是爹地的第6个孩子</li>
			<li>我是爹地的第7个孩子</li>
			<li>我是爹地的第8个孩子</li>
			<li>我是爹地的第9个孩子</li>
			<li>我是爹地的第10个孩子</li>
		</ul>
		
		
		<!--
			这种选中方式是从父元素的角度查看所有的子元素，将所有子元素看做一个集合，并且编号，然后从包含所有子元素的集合中选取指定序号的元素(并且该元素类型为指定类型)，注意和E:nth-of-type(n)的区别
			假设:
				样式 li:nth-child(5){color:#f00} 
				内容 
				<ul>
					<li>我是爹地的第1个孩子</li>
					<li>我是爹地的第2个孩子</li>
					<li>我是爹地的第3个孩子</li>
					<li>我是爹地的第4个孩子</li>
					<p>我是爹地的第5个孩子</p>  	这是第五个元素 但是不是li标签，所以无法选中
					<li>我是爹地的第6个孩子</li>
					<li>我是爹地的第7个孩子</li>
					<li>我是爹地的第8个孩子</li>
					<li>我是爹地的第9个孩子</li>
					<li>我是爹地的第10个孩子</li>
				</ul>
		-->
	</body>
</html>
			